<!--  -->
<template>
  <div class="files-add-person" v-loading="loading">
    <div class="files-add-basic" ref="basicInfor">
      <el-form
        :inline="true"
        size="mini"
        ref="form"
        :model="form"
        class="demo-form-inline"
      >
        <div class="border">
          <el-form-item label="资料名称">
            <el-input
              type="textarea"
              placeholder="请输入资料名称"
              v-model="form.name"
              clearable
              @blur="onBlur('form', 'name')"
              style="width: 200px"
            ></el-input>
          </el-form-item>
          <el-form-item label="来文单位">
            <el-input
              type="textarea"
              placeholder="请输入来文单位"
              v-model="form.issuingEnterprise"
              clearable
              @blur="onBlur('form', 'issuingEnterprise')"
              style="width: 200px"
            ></el-input>
          </el-form-item>

          <el-form-item label="来文文号">
            <el-input
              placeholder="请输入来文文号"
              v-model="form.documentNumber"
              clearable
              @blur="onBlur('form', 'documentNumber')"
              style="width: 200px"
            ></el-input>
          </el-form-item>

          <el-form-item label="发文日期">
            <el-date-picker
              v-model="form.publishDate"
              type="date"
              placeholder="选择日期"
              value-format="yyyy-MM-dd"
            >
            </el-date-picker>
          </el-form-item>
          <el-form-item label="收文日期">
            <el-date-picker
              v-model="form.receivedDate"
              type="date"
              placeholder="选择日期"
              value-format="yyyy-MM-dd"
            >
            </el-date-picker>
          </el-form-item>
          <el-form-item label="关键字">
            <el-input
              placeholder="请输入关键字"
              v-model="form.keyContent"
              clearable
              @blur="onBlur('form', 'keyContent')"
              style="width: 200px"
            ></el-input>
          </el-form-item>

          <el-form-item label="档案位置">
            <el-input
              placeholder="请输入档案位置"
              v-model="form.location"
              clearable
              @blur="onBlur('form', 'location')"
              style="width: 200px"
            ></el-input>
          </el-form-item>
          <el-form-item label="备注">
            <el-input
              placeholder="请输入备注"
              v-model="form.remark"
              clearable
              @blur="onBlur('form', 'remark')"
              style="width: 700px"
            ></el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="info" size="small" @click="goback">返回</el-button>
            <el-button type="primary" size="small" @click="saveFun(1)"
              >保存并返回</el-button
            >
            <!-- <el-button
              size="small"
              v-if="isAdd"
              @click="saveFun(2)"
              >保存并继续新增</el-button
            > -->

            <!-- <el-button
              type="primary"
              @click="onSubmit"
              icon="el-icon-search"
              size="mini"
              >识别二维码</el-button
            > -->
            <!-- <el-button
              type="info"
              @click="onSave"
              icon="el-icon-add"
              size="mini"
              >保存数据</el-button
            > -->
          </el-form-item>
        </div>
      </el-form>
    </div>
    <div class="files-add-picture">
      <el-form class="demo-form-inline" :inline="true" size="mini">
        <el-form-item v-if="typeId != -1">
          <el-button
            :type="device == 3 ? 'success' : 'info'"
            icon="el-icon-add"
            size="mini"
            @click="changeDevice(3)"
            >上传本地文件</el-button
          >
          <el-button
            :type="device == 1 ? 'success' : 'info'"
            @click="changeDevice(1)"
            size="mini"
            >高拍仪</el-button
          >
        </el-form-item>
      </el-form>
      <div class="files-main">
        <div class="files-main-left">
          <template v-if="device == 1">
            <div :style="{ height: aheight + 'px' }" class="gpyBox">
              <img
                :src="videoImg"
                class="CameraImg"
                style="width: 100%; height: 100%; display: block"
                v-if="videoImg"
              />
            </div>
            <div class="deviceOp">
              <el-button type="danger" size="mini" @click="newRebootDevice"
                >重启设备</el-button
              >
              <el-button type="danger" size="mini" @click="newRotateVideo"
                >旋转</el-button
              >
              <el-button type="primary" size="mini" @click="newTakePhoto"
                >拍照</el-button
              >
            </div>
          </template>
          <template v-if="device == 3">
            <ImageUpload
              :limit="1"
              :typeName="typeName"
              :fileName="fileName"
              :showFileList="true"
              @handleUploadImage="handleUploadImage"
              style="width: 600px"
            />
          </template>
        </div>
        <div class="files-main-right" v-if="device == 1">
          <!-- <div
            style="
              font-size: 14px;
              margin-bottom: 10px;
              width: 100%;
              text-align: center;
            "
          >
            当前选择的附件类型：<span
              style="font-weight: bold; font-size: 16px"
              >{{ annexMsg }}</span
            >
          </div> -->
          <div class="files-list" :style="{ height: aheight + 'px' }">
            <div
              class="image-box"
              v-for="(item, index) in showImageList"
              :key="item.filePath"
            >
              <div class="ImgItem">
                <div class="pic-op-btn">
                  <i
                    class="el-icon-delete del-icon"
                    @click="delImg(item)"
                    title="删除"
                  ></i>
                  <i
                    class="el-icon-download pic-download-icon"
                    @click="downloadImg(item, index)"
                    title="下载"
                  ></i>
                  <!-- v-if="attachmentTypeYS != -1" -->
                  <i
                    class="el-icon-scissors cropper-btn"
                    @click="
                      cropperFlag = true;
                      cropperItem = item;
                      cropperItemIndex = index;
                    "
                    v-if="attachmentTypeYS != -1"
                    title="裁剪"
                  ></i>
                </div>
                <el-image
                  style="width: 100%; height: 120px"
                  :src="item.fileShowPath"
                  :preview-src-list="srcList"
                  fit="contain"
                >
                </el-image>
              </div>
              <!-- <p class="image-name">
                <template v-if="!item.fileName"
                  >{{ item.typeName }}.{{ item.extName }}</template
                >
                <template v-else>{{ item.fileName }}</template>
              </p> -->
            </div>
          </div>
          <el-button
            type="text"
            @click="openScan"
            style="width: 100%"
            v-if="showImageList.length > 0"
            >浏览模式</el-button
          >
        </div>
      </div>
      <!-- <div class="files-footer">
        <el-button type="info" size="small" @click="goback">返回</el-button>
        <el-button type="primary" size="small" @click="saveFun(1)"
          >保存并返回</el-button
        >
        <el-button type="warning" size="small" v-if="isAdd" @click="saveFun(2)"
          >保存并继续新增</el-button
        >
      </div> -->
    </div>
    <el-dialog
      :visible.sync="cropperFlag"
      width="640px"
      :close-on-click-modal="false"
      :modal-append-to-body="false"
      v-if="cropperFlag"
    >
      <cropper
        :annexMsg="annexMsg"
        :cropperItem="cropperItem"
        :uploadFileUrl="uploadFileUrl"
        @updataItem="updataItem"
      ></cropper>
    </el-dialog>
    <div class="files-add-window" v-if="isScan">
      <div class="files-add-basic">
        <el-form :inline="true" size="mini" class="demo-form-inline">
          <div class="border" style="padding: 10px 10px 0 10px">
            <el-form-item>
              <el-button type="info" size="small" @click="gobackEdit"
                >返回</el-button
              >
            </el-form-item>
          </div>
        </el-form>
        <div class="scan-file-list">
          <div
            class="image-box"
            v-for="(item, index) in showImageList"
            :key="item.filePath"
          >
            <div class="ImgItem">
              <div class="pic-op-btn">
                <i
                  class="el-icon-delete del-icon"
                  @click="delImg(item)"
                  title="删除"
                ></i>
                <i
                  class="el-icon-download pic-download-icon"
                  @click="downloadImg(item, index)"
                  title="下载"
                ></i>
                <!-- v-if="attachmentTypeYS != -1" -->
                <i
                  class="el-icon-scissors cropper-btn"
                  @click="
                    cropperFlag = true;
                    cropperItem = item;
                    cropperItemIndex = index;
                  "
                  v-if="attachmentTypeYS != -1"
                  title="裁剪"
                ></i>
              </div>
              <el-image
                style="width: 100%; height: 120px"
                :src="item.fileShowPath"
                :preview-src-list="srcList"
                fit="contain"
              >
              </el-image>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<!-- <script src="./gpyhs.js" type="text/javascript" charset="UTF-8"></script> -->
<script>
import ImageUpload from "@/components/ImageUpload/index.vue";
import { UpladFile } from "../../../../static/js/upload.js";
import { CreateWebSocket, ReadIDCard, setOnMessage } from "@/api/readCard";
import Cropper from "./cropper.vue";
import { dictReimburType, dictReimburBillType } from "@/api/index";
import {
  archivesAdd,
  deleteFile,
  uploadBase64,
  getDataInfo,
  dataUpdate,
} from "@/api/files/basics";
import {
  oConnetSocket,
  oGetCamera,
  oOpenCamera,
  oCloseCamera,
  oSetVideoMode,
  oTakephoto,
  oRotateVideo,
} from "@/api/gpyAIOSvr.js";
import { getToken } from "@/utils/auth";
export default {
  components: { ImageUpload, Cropper },
  props: [
    "dictData",
    "id",
    "onlyUpload",
    "websocket",
    "isAdd",
    "insuranceType",
  ],
  data() {
    return {
      typeName: "",
      fileName: "",
      isScan: false,
      reimburBillType: null,
      form: {
        type: "", //上传类型
        name: "",
        fileName: "",
        keyContent: "",
        location: "",
        publishDate: "",
        //add by yangsheng
        documentNumber: "",
        receivedDate: "",
        issuingEnterprise: "",
      },
      formOrg: {
        type: "", //上传类型
        name: "",
        fileName: "",
        keyContent: "",
        location: "",
        publishDate: "",
        //add by yangsheng
        documentNumber: "",
        receivedDate: "",
        issuingEnterprise: "",
      },
      reimburType: "",
      sexList: [
        {
          key: "男",
          value: "男",
        },
        {
          key: "女",
          value: "女",
        },
      ],
      attachmentTypeYS: -1,
      typeId: "",
      annexMsg: "",
      annexList: [],
      educationList: [],
      punishList: [
        {
          key: "否",
          value: "否",
        },
        {
          key: "是",
          value: "是",
        },
      ],
      CamID: "", //设备
      DevResolution: "", //分辨率
      srcList: [],
      imageList: [],
      showImageList: [],
      aheight: "",
      resizeFlag: null,
      device: 3,
      uploadFileUrl: process.env.VUE_APP_BASE_API + "/archive/annex/upload", // 上传的图片服务器地址
      headers: {
        Authorization: "Bearer " + getToken(),
      },
      fileList: [],
      loading: false,
      //websocket: null,
      videoImg: "",
      eduList: [],
      cropperFlag: false, // 裁剪
      cropperItem: null,
      cropperItemIndex: null,
    };
  },
  computed: {},
  watch: {
    // insuranceType: {
    //   handler: function () {
    //     this.getReimburType();
    //   },
    //   immediate: true,
    // },
  },
  //方法集合
  methods: {
    onReadIDCard() {
      ReadIDCard(this.websocket);
    },
    onBlur(key1, key) {
      this[key1][key] = this[key1][key] ? this[key1][key].trim() : "";
    },
    //报销类型
    getReimburType() {
      console.log(this.form);
      let params = {
        medicalInsuranceTypeKey: this.form.medicalInsuranceTypeKey,
      };
      dictReimburType(params).then((res) => {
        if (res.code == 200) {
          this.reimburType = res.data;
        } else {
          this.$message.warning(res.msg);
        }
      });
    },
    //更改医保类型
    medicalInsuranceTypeChange(e) {
      this.form.medicalInsuranceType = this.findArrayList(
        this.insuranceType,
        e
      );
      this.getReimburType();
    },
    findArrayList(arr, key) {
      let value = "";
      for (let i = 0; i < arr.length; i++) {
        if (key == arr[i].key) {
          value = arr[i].value;
          break;
        }
      }
      return value;
    },
    reimbursementTypeChange(e) {
      this.form.reimbursementType = this.findArrayList(this.reimburType, e);
      this.getReimburBillType();
    },
    //报销凭证类型
    getReimburBillType() {
      let params = {
        eimbursementTypeId: this.form.reimbursementTypeKey,
      };
      dictReimburBillType(params).then((res) => {
        if (res.code == 200) {
          this.reimburBillType = res.data;
        } else {
          this.$message.warning(res.msg);
        }
      });
    },
    setPageOpe() {
      if (this.id) {
        this.getInfoForm();
        //this.getAnnexList();
      }
    },
    getInfoForm() {
      this.loading = true;
      this.imageList = [];
      // let data = { id: this.id };
      let id = this.id;
      getDataInfo(id).then((res) => {
        if (res.code == 200) {
          this.form = res.data;
          this.loading = false;
          //this.getReimburType();
          //this.getReimburBillType();
        } else {
          this.$message.warning(res.msg);
          this.loading = false;
        }
      });
    },
    openScan() {
      this.isScan = true;
      this.typeName = "--全部--";
      if (this.typeName == "--全部--" || !this.typeName) {
        this.showImageList = JSON.parse(JSON.stringify(this.imageList));
      } else {
        this.showImageList = this.sortImgList(this.imageList, this.typeName);
      }
      this.getSrcList();
    },

    getAnnexList() {
      this.loading2 = true;
      let data2 = { personnelId: this.id };
      getAnnexList(data2).then((res) => {
        if (res.code == 200) {
          this.loading2 = false;
          let imageList = [];
          res.data.forEach((item) => {
            let obj = {
              id: item.id,
              fileShowPath: item.fileShowPath, //预览地址
              filePath: item.filePath, //下载地址
              fileName: item.fileName,
              typeName: item.typeName,
            };
            imageList.push(obj);
          });
          this.imageList = imageList;
          if (this.typeName == "--全部--" || !this.typeName) {
            this.showImageList = JSON.parse(JSON.stringify(this.imageList));
          } else {
            this.showImageList = this.sortImgList(
              this.imageList,
              this.typeName
            );
          }
          this.getSrcList();
        } else {
          this.loading2 = false;
          this.$message.warning(res.msg);
        }
      });
    },
    sortImgList(list, typeName) {
      let resList = []; //学历证明
      list.forEach((item) => {
        if (item.typeName == typeName) {
          resList.push(item);
        }
      });
      return resList;
    },
    goback() {
      this.$emit("closeAddFiles", 1);
    },
    gobackEdit() {
      this.isScan = false;
    },
    saveFun(type) {
      if (this.id) {
        this.editPersonnel(type);
      } else {
        this.add(type);
      }
    },
    editPersonnel(type) {
      let data = this.form;
      data.id = this.id;
      data.arcPersonnelAnnexList = [];
      data.editPersonnelAnnexList = [];
      this.imageList.forEach((item) => {
        if (item.type == "new") {
          let obj = {
            filePath: item.filePath, //相对地址
            fileName: item.fileName,
            typeName: item.typeName,
          };
          data.arcPersonnelAnnexList.push(obj);
        } else if (item.type === "edit") {
          let obj = {
            filePath: item.filePath, //相对地址
            id: item.id,
          };
          data.editPersonnelAnnexList.push(obj);
        }
      });
      dataUpdate(data).then((res) => {
        if (res.code == 200) {
          this.$message.success("保存成功");
          if (type == 1) {
            this.$emit("closeAddFiles");
          } else {
            this.id = "";
          }
          this.form = JSON.parse(JSON.stringify(this.formOrg));
          this.imageList = [];
          this.showImageList = [];
          this.srcList = [];
        } else {
          this.$message.warning(res.msg);
        }
      });
    },
    add(type) {
      if (this.device == 1) {
        this.form.type = 1; //高拍仪
      } else if (this.device == 3) {
        this.form.type = 0; //本地上传
      }
      console.log(this.form);
      let data = this.form;
      data.officeArchivesAnnexList = [];
      this.imageList.forEach((item) => {
        let obj = {
          filePath: item.filePath,
          fileName: item.fileName,
          typeName: item.typeName,
        };
        data.officeArchivesAnnexList.push(obj);
      });

      archivesAdd(data).then((res) => {
        if (res.code == 200) {
          this.$message.success("保存成功");
          if (type == 1) {
            this.$emit("closeAddFiles");
          }
          this.form = JSON.parse(JSON.stringify(this.formOrg));
          //this.typeId = this.annexList[0].key;
          //this.annexMsg = this.annexList[0].value;
          this.imageList = [];
          this.showImageList = [];
          this.srcList = [];
        } else {
          this.$message.warning(res.msg);
        }
      });
    },
    handleUploadImage(fileList, name) {
      if (!this.form.name && name) {
        let nm = name.split(".");
        this.form.name = nm[0];
        this.form.fileName = name;
      }
      if (name) {
        this.form.fileName = name;
      }
      let imageList = JSON.parse(JSON.stringify(this.imageList));
      let imageListMerge = fileList.concat(imageList);
      imageListMerge[0].index =
        imageListMerge.length == 1 ? 1 : imageListMerge[1].index + 1;
      this.imageList = JSON.parse(JSON.stringify(imageListMerge));
      if (this.typeName == "--全部--" || !this.typeName) {
        this.showImageList = JSON.parse(JSON.stringify(this.imageList));
      } else {
        this.showImageList = this.sortImgList(this.imageList, this.typeName);
      }
      this.getSrcList();
    },
    annexChange(value) {
      if (value == "--全部--") {
        this.showImageList = JSON.parse(JSON.stringify(this.imageList));
      } else {
        this.showImageList = this.sortImgList(this.imageList, value);
      }
      this.getSrcList();
      //记录当前选择的附件类型，用于判断是否显示裁剪按钮

      this.attachmentTypeYS = value;
    },
    delImg(item) {
      let that = this;
      that.$modal
        .confirm("是否确认删除当前图片？")
        .then(function () {
          let index = -1;
          for (let i = 0; i < that.imageList.length; i++) {
            let mitem = that.imageList[i];
            if (mitem.fileShowPath == item.fileShowPath) {
              index = i;
              break;
            }
          }
          if (!that.id) {
            that.imageList.splice(index, 1);
            if (that.typeName == "--全部--" && !that.typeName) {
              that.showImageList = JSON.parse(JSON.stringify(that.imageList));
            } else {
              that.showImageList = that.sortImgList(
                that.imageList,
                that.typeName
              );
            }
            that.getSrcList();
            that.$message.success("删除成功！");
          } else {
            if (item.id) {
              deleteFile(item.id).then((res) => {
                if (res.code == 200) {
                  that.$message.success("删除成功！");
                  that.imageList.splice(index, 1);
                  if (that.typeName == "--全部--" && !that.typeName) {
                    that.showImageList = JSON.parse(
                      JSON.stringify(that.imageList)
                    );
                  } else {
                    that.showImageList = that.sortImgList(
                      that.imageList,
                      that.typeName
                    );
                  }
                  that.getSrcList();
                }
              });
            } else {
              that.$message.success("删除成功！");
              that.imageList.splice(index, 1);
              if (that.typeName == "--全部--" && !that.typeName) {
                this.showImageList = JSON.parse(JSON.stringify(this.imageList));
              } else {
                this.showImageList = this.sortImgList(
                  this.imageList,
                  that.typeName
                );
              }
              that.getSrcList();
            }
          }
        })
        .catch(() => {});
    },
    getSrcList() {
      let srcList = [];
      this.showImageList.forEach((item) => {
        srcList.push(item.fileShowPath);
      });
      this.srcList = srcList;
    },
    getSrcListScan() {
      let srcList = [];
      this.showImageListScan.forEach((item) => {
        srcList.push(item.fileShowPath);
      });
      this.srcListScan = srcList;
    },
    //更改设备
    changeDevice(type) {
      this.device = type;
      if (type == 1) {
        oOpenCamera();
      } else {
        oCloseCamera();
      }
    },
    /*********************
     ***    初始化操作  ***
     **********************/

    LoadCameraDocument() {
      if (!window.WebSocket) {
        alert("浏览器不支持HTML5,请更新浏览器或者使用其它浏览器");
      }
      console.log("LoadCameraDocument");
      var obj = document.getElementById("CameraCtl");
      Cam_ControlInit(obj, 0, 0, 400, 500);
    },
    /*********************
     ***    打开摄像头  ***
     **********************/
    toOpenCamera() {
      // var CamID = document.getElementById("DevName").selectedIndex;
      // var obj = document.getElementById("DevResolution");
      // var restr = obj[obj.selectedIndex].text;
      // var pos = restr.lastIndexOf("*");
      // var width = parseInt(restr.substring(0, pos));
      // var height = parseInt(restr.substring(pos + 1, restr.length));
      var CamID = this.CamID; //设备
      var restr = this.DevResolution;
      var pos = restr.lastIndexOf("*");
      var width = parseInt(restr.substring(0, pos));
      var height = parseInt(restr.substring(pos + 1, restr.length));
      Cam_Open(CamID, width, height);
    },

    /*********************
     ***    关闭摄像头  ***
     **********************/
    toCloseCamera() {
      Cam_Close();
    },
    /*********************
     ***       拍照     ***
     **********************/
    TakePhoto() {
      var name = formatDate(new Date().getTime());

      var obj = document.getElementById("FileType");
      var path;
      Cam_SetFileType(obj.selectedIndex); //设置文件格式
      // if (obj.selectedIndex == 0) {
      //   path = "D:\\" + name + ".jpg";
      // } else if (obj.selectedIndex == 1) {
      //   path = "D:\\" + name + ".png";
      // } else if (obj.selectedIndex == 2) {
      //   path = "D:\\" + name + ".tif";
      // } else if (obj.selectedIndex == 3) {
      //   path = "D:\\" + name + ".pdf";
      // } else {
      //   path = "D:\\" + name + ".jpg";
      // }
      path = "D:\\" + name + ".png";
      //Cam_Photo(path); //主摄像头拍照
      let base64data = Cam_Photo(""); //主摄像头拍照
      let fileName = this.fileName;
      let token = getToken();
      UpladFile(
        this.uploadFileUrl,
        base64data,
        fileName,
        token,
        this.callBack,
        this.successCallBack
      );
    },
    newTakePhoto() {
      oTakephoto();
    },
    newRotateVideo() {
      oRotateVideo();
    },
    callBack(iRestStr) {
      this.$message.warning(iRestStr);
    },

    uploadFailed() {
      this.$message.warning("上传图片失败，请重试");
    },
    //重启设备
    rebootDevice() {
      let _this = this;
      _this.LoadCameraDocument();
      setTimeout(() => {
        _this.toOpenCamera();
      }, 1000);
    },
    //下载图片
    downloadImg(item) {
      //window.location.href = item.path;
      var a = document.createElement("a"); // 创建一个<a></a>标签
      a.href = process.env.VUE_APP_BASE_API + item.filePath; //重点（如测试发现下载文件不存在/找不到，检查路径）
      a.download = item.fileName ? item.fileName : this.fileName; // 设置下载文件文件名
      a.style.display = "none"; // 隐藏a标签
      document.body.appendChild(a); // 将a标签追加到文档对象中
      a.click(); // 模拟点击了a标签，会触发a标签的href的读取，浏览器就会自动下载了
      a.remove(); // 一次性的，用完就删除a标签
    },
    async updateAdd() {
      let h =
        window.innerHeight ||
        document.documentElement.clientHeight ||
        document.body.clientHeight; //浏览器高度
      let topH = 0;
      if (!this.onlyUpload && this.$refs.basicInfor) {
        topH = this.$refs.basicInfor.offsetHeight;
      }
      let tableHeight = h - topH - 310;
      this.aheight = tableHeight;
      console.log(this.aheight);
      await this.$nextTick();
    },
    newCallBack(data) {
      let data1 = {
        base64: data,
        fileExt: "jpg",
      };
      uploadBase64(data1).then((res) => {
        this.successCallBack(res);
      });
    },
    successCallBack(res) {
      if (res.code == 200) {
        this.$message.success("上传成功");
        let data = res.data;
        let uploadList = [];
        let obj = {
          filePath: data.saveFilePath,
          fileShowPath: data.url,
          typeName: this.typeName,
          fileName: this.fileName,
          extName: "jpg",
          type: "new",
        };
        uploadList.push(obj);
        this.handleUploadImage(uploadList);
      } else {
        this.$message.warning("上传图片失败，请重试");
      }
    },
    //打开摄像头的回调函数
    getImgData(videoImg) {
      this.videoImg = videoImg;
    },
    initGPY() {
      oConnetSocket(this.getImgData, this.newCallBack);
    },
    newRebootDevice() {
      oCloseCamera();
      this.initGPY();
    },
    getEventData(data) {
      console.log("页面调用addPerson");
      console.log(data);
      this.form = JSON.parse(JSON.stringify(this.formOrg));
      if (data) {
        let dArr = data.split("|");
        this.form.name = dArr[0].split(":")[1];
        this.form.sex = dArr[1] ? dArr[1] : "";
        this.form.idCard = dArr[5] ? dArr[5] : "";
        this.form.nativePlace = dArr[4] ? dArr[4] : "";
      }
      console.log(this.form);
    },
    // 更新裁剪后的内容
    updataItem(data) {
      this.cropperItem.filePath = data.saveFilePath;
      this.cropperItem.fileShowPath = data.url;
      this.showImageList[this.cropperItemIndex].filePath = data.saveFilePath;
      this.showImageList[this.cropperItemIndex].type = this.showImageList[
        this.cropperItemIndex
      ].type
        ? this.showImageList[this.cropperItemIndex].type
        : "edit";
      this.srcList[this.cropperItemIndex] = data.url;
      this.cropperFlag = false;
    },
  },
  //生命周期 - 创建完成（可以访问当前this实例）
  created() {
    this.initGPY();
  },
  //生命周期 - 挂载完成（可以访问DOM元素）
  mounted() {
    let _this = this;
    _this.form = JSON.parse(JSON.stringify(this.formOrg));
    _this.imageList = [];
    _this.showImageList = [];
    _this.srcList = [];
    //_this.getEducationSub();
    //_this.getTypeDictData();
    _this.setPageOpe();
    //_this.$nextTick(() => {
    //_this.LoadCameraDocument();
    //});

    _this.updateAdd();
    window.onresize = () => {
      if (_this.resizeFlag) {
        clearTimeout(_this.resizeFlag);
      }
      _this.resizeFlag = setTimeout(() => {
        _this.updateAdd();
        _this.resizeFlag = null;
      }, 100);
    };
  },
  beforeCreate() {}, //生命周期 - 创建之前
  beforeMount() {}, //生命周期 - 挂载之前
  beforeUpdate() {}, //生命周期 - 更新之前
  updated() {}, //生命周期 - 更新之后
  beforeDestroy() {
    oCloseCamera();
  }, //生命周期 - 销毁之前
  destroyed() {}, //生命周期 - 销毁完成
  activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
};
</script>
<style lang="scss" scoped>
//@import url(); 引入公共css类
.files-add-person {
  padding: 20px 30px;
  h2 {
    font-size: 14px;
  }
  .files-main {
    display: flex;
    margin-top: 20px;
    &-right {
      margin-left: 20px;
      width: 160px;
      .files-list {
        width: 100%;
        overflow-y: scroll;
      }
      .image-box {
        border: 1px #bbb solid;
        margin-bottom: 10px;
        > p {
          font-size: 14px;
          text-align: center;
          padding: 0;
          margin: 0;
        }
      }
    }
    &-left {
      flex: 1;
    }
  }
  .files-footer {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    margin-top: 15px;
  }
  .ImgItem {
    position: relative;
    .pic-op-btn {
      position: absolute;
      bottom: 0;
      width: 100%;
      height: 28px;
      background: rgba(0, 0, 0, 0.2);
      display: flex;
      align-items: center;
      justify-content: center;
      z-index: 999;
      > .pic-download-icon {
        display: block;
        cursor: pointer;
        font-size: 24px;
        margin: 0 12px;
      }
      > .del-icon {
        font-size: 24px;
        cursor: pointer;
        display: block;
      }
      > .cropper-btn {
        font-size: 24px;
        cursor: pointer;
      }
    }
  }
}
.deviceOp {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 16px;
}
.gpyBox {
  width: 100%;
  background: #eee;
}
.files-add-window {
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
  height: calc(100vh - 80px);
  background: #fff;
  z-index: 99999;
  .scan-file-list {
    clear: both;
    overflow: hidden;
    padding: 20px;
    .image-box {
      float: left;
      margin: 4px;
      border: 1px #bbb solid;
    }
    .ImgItem {
      width: 240px;
    }
  }
}
</style>
<style rel="stylesheet/scss" lang="scss">
.demo-form-inline.el-form--inline .el-form-item__label {
  float: left;
}
</style>
